<template>
  <div>
    <custom-form
      :columns="columns"
      :rules="rules"
      v-bind="$attrs"
      v-on="listeners"
    >
    <template slot="add">
      <el-button type="primary" @click="addInput">添加检查内容</el-button>
    </template>
    </custom-form>
  </div>

</template>

<script>
import customFromMixin from '@/utils/mixin/custom-form'

export default {
  name: 'AddForm',
  mixins: [customFromMixin],
  data() {
    return {
      rules: {},
      // 列配置
      columns: [
        { name: '名称', field: 'name', opts: { required: true, maxlength: 50 } },
        { name: '检查内容', field: 'content', opts: { required: true, maxlength: 50 } },
        { name: '', field: 'add', opts: { maxlength: 50, btn_text: '添加内容' }, type: 'button' }
        // { name: '地址', field: 'address', opts: { required: true, maxlength: 50 } }
        // { name: '性别', type: 'sex', field: 'radio', list: ['是', '否'], opts: { required: true, maxlength: 50 }, value: 1 },
        // { name: '性别', type: 'radio', field: 'sex', label: true, opts: { required: true, maxlength: 50 }, value: 1 },
        // { name: '下拉框', type: 'select', field: 'select', list: ['广东', '汕头', '潮阳'] }
        // { name: '下拉框', type: 'select', field: 'type', label: true }
        // { name: '图片', field: 'image', opts: { required: true, maxlength: 255 }, type: 'upload_image' },
        // {
        //   name: '图片',
        //   field: 'image',
        //   opts: { required: true, control: 'attachment', name: 'link', pk: 'url', query: { category: 'image' }, format: 'image' },
        //   type: 'select_table'
        // },
        // { name: '链接', field: 'link', opts: { required: true, maxlength: 255 } },
        // { name: '状态', field: 'status', label: true, type: 'radio', opts: { required: true } }
      ]
    }
  },
  watch: {},
  methods: {
    // 添加内容
    addInput() {
      var that = this
      var content = 'content' + that.columns.length
      var arr = that.columns
      arr.splice(that.columns.length - 1, 0, { name: '检查内容', field: content, opts: { required: true, maxlength: 50 } })
      that.columns = arr
      console.log(that.columns)
    }
  }

}
</script>

<style scoped>

</style>
